$defaultColor: #ff7a45;
$numberColor: #2a79f0;
$unColor: #fb5c7c;
$backgroundColor: #fff;
$hintColor: #e3eaef;
$typeColor: #5c6269;
$textColor: #2f3336;
$defaultTextColor: #8c939b;
.container {
  box-sizing: border-box;
  .AtGridCons {
    background: #ff7a45;
    border-radius: 8rpx;
  }
  .title {
    margin-top: 40px;
    margin-bottom: 24px;
    color: #2f3336;
    font-size: 32px;
    font-family: PingFangSC-Medium;
  }

  .ticketContent {
    display: flex;
    justify-content: space-between;
    & > view {
      flex: 0 0 320px;
      text-align: center;
      background: #fff;
      border-radius: 8px;
      box-shadow: 0 0 20px 0 rgba(216, 213, 212, 0.3);
      .status {
        padding: 36px 0 20px;
        color: #5c6269;
        font-size: 28px;
        line-height: 32px;
      }
      .count {
        padding-bottom: 32px;
        color: #ff7a45;
        font-size: 48px;
        font-family: PingFangSC-Medium;
      }
      .feedBackCount {
        color: #6280f5;
      }
    }
  }
  .sales-container {
    margin-top: 20rpx;
    margin-bottom: 20rpx;
    font-size: 32rpx;
    background: $backgroundColor;
    border-radius: 8rpx;
    box-shadow: 0 0 10px 0 rgba(216, 213, 212, 0.3);
    .sales-title {
      padding: 28rpx 16rpx 32rpx 32rpx;
      .sales-title-item {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        view:first-child {
          font-weight: bolder;
          text {
            color: #8b939c;
            font-weight: normal;
            font-size: 24rpx;
          }
        }
        view:nth-child(2) {
          color: $defaultColor;
          font-weight: normal;
          font-size: 24rpx;
        }
        .sales-more {
          position: relative;
          padding-right: 32rpx;
          &::after {
            position: absolute;
            top: 50%;
            width: 14rpx;
            height: 14rpx;
            border-top: 2rpx solid $defaultColor;
            border-right: 2rpx solid $defaultColor;
            transform: rotate(45deg) translateY(-50%);
            content: "";
          }
        }
        button {
          display: inline-block;
          width: auto;
          padding: 6rpx 16rpx;
          color: #5c6268;
          font-size: 24rpx;
          line-height: 34rpx;
          white-space: nowrap;
          background-color: #f1f3fb;
        }
        .button-hover {
          background-color: #dedede;
        }
      }
    }
    .sales-un-money {
      padding: 0 0 32rpx 32rpx;
      view:nth-child(n + 2) {
        color: $unColor;
        font-size: 48rpx;
      }
    }
    .sales-money {
      padding-bottom: 32rpx;
      .sales-money-title {
        display: flex;
        .sales-money-title-text {
          position: relative;
          display: inline-block;
          padding-left: 32rpx;
          &::before {
            position: absolute;
            top: 50%;
            left: 0;
            width: 8rpx;
            height: 28rpx;
            background: $defaultColor;
            transform: translateY(-50%);
            content: "";
          }
        }
        .sales-money-line {
          position: relative;
          flex: 1;
          margin-right: 32rpx;
          &::after {
            position: absolute;
            top: 50%;
            left: 16rpx;
            width: 100%;
            height: 2rpx;
            background: $hintColor;
            transform: translateY(-50%);
            content: "";
          }
        }
      }

      view:nth-child(n + 2) {
        margin-top: 24rpx;
        padding: 0rpx 0 0rpx 32rpx;
        color: $typeColor;
        font-size: 28rpx;
        text {
          margin-left: 48rpx;
          color: $textColor;
        }
      }
    }
  }
}
